﻿<html>
  <head>
    <title>HorseJs</title>
    <link rel="stylesheet" href="./icon/iconfont.css" />
    <link rel="stylesheet" href="./common.css" />
    <style>
      .content {
        color: rgb(0, 122, 204);
        flex: 1;
        flex-direction: column;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: justify;
      }
      .title {
        font-size: 66px;
        padding-bottom: 60px;
      }
      .version {
        line-height: 32px;
      }
      .link {
        line-height: 32px;
        display: flex;
      }
      .link div {
        margin: 0px 12px;
        text-decoration: underline;
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <div class="titleBar">
      <div class="titleTool">
        <div class="iconfont horse-minimize"></div>
        <div class="iconfont horse-maximize"></div>
        <div class="iconfont horse-close closeBtn"></div>
      </div>
    </div>
    <div class="content">
      <div class="title">HorseJs</div>
      <div class="version">version：0.0.1</div>
      <div class="link">
        <div id="demoLink">demo</div>
        <div id="docLink">doc</div>
      </div>
    </div>
    <script type="module">
      import { titleBarBtnLogic } from "./common.js";
      let linkLogic = () => {
        document.querySelector("#docLink").addEventListener("click", () => {
          horse.shell.openExternal({
            target: "https://gitee.com/horsejs/horsejs#%E6%96%87%E6%A1%A3",
            workingDir: "",
          });
        });
        document.querySelector("#demoLink").addEventListener("click", () => {
          horse.window.open({
            url: "http://horse/app/demo.html",
            width: 1024,
            height: 768,
          });
        });
      };
      window.addEventListener("load", async () => {
        titleBarBtnLogic();
        linkLogic();
        horse.window.addEventListener("show", () => {
          console.log("show");
        });
      });
    </script>
  </body>
</html>
